<template>
	<!-- 卡片管理 激活码 -->
	<view  class="cardmanage activationcode">
		
		<view class="search_box">
			<view class="search_borderzz">
				<image class="sousuo" :src="photo_cdn+'zpupload/static/zuzhi/sousuo.png'" mode=""></image>
				<input v-model="skeyword"  confirm-type="search" @confirm="searchfun" class="search_input" placeholder="家谱"></input>
				<view class="search_subbtn" @tap="searchfun">搜索</view>
			</view>
		</view>	

		<view class="carddatalist">
			
			<!-- 卡片管理 -->
			<view >
				<view v-for="(item,index) in cardlist" :key="index" class="cardinfoitemone cardinfoitem flex">
					<view class="cardinfoitem_left  flex flexc">
						<image class="usertxs" :src="photo_cdn+'zpupload/static/icon/cardicon.png'" mode=""></image>
					</view>
					<view class="cardinfoitem_right flex1 flex jus-b ali-c">
						<view>
							<view class="cardnumbear">{{item.activation_code}} ({{item.name}})</view>
						</view>
						<view>
							<!-- <view class="cardstatus cardstatus1" v-show="item.status==1">冻结</view> -->
							<view v-if="!item.user_id" @tap="copecode(item)" class="cardstatus cardstatus2 mt-10" >复制卡密</view>
							<view class="cardstatus" v-else>已激活</view>
							<!-- v-show="item.status==1"
							<view class="cardstatus" v-show="item.status==2">已激活</view>
							<view class="cardstatus" v-show="item.status==3">已注销</view>
							<view class="cardstatus" v-show="item.status==4">已兑换</view>
							<view class="cardstatus" v-show="item.status==5">已过期</view> -->
						</view>
					</view>
				</view>
			</view>
			
		</view>
		
		

		<view class="emptybox" v-if="cardlist.length==0">
			<image class="img" :src="photo_cdn  +'zpupload/static/base/empty-image-default.png'" mode=""></image>
		</view>
		
		<pageScrollTo v-if="isshowtop" />
	</view>
</template>

<script>
	import {myCreateFamilyPeople} from "@/utils/api/zupu.js";
	import pageScrollTo from "@/components/pageScrollTo/pageScrollTo.vue";
	import config from "@/utils/config.js";
	let {staticurl,photo_cdn} = config.baseUrl;
	export default {
		components:{
			pageScrollTo,
		},
		data(){
			return {
				photo_cdn,
				isshowtop:false,//置顶开关
				cardlist:[],
				page:0,
				isshowall:false,
				
				constdata:{userCount:0},//统计的数据
				
				skeyword:"",
				activation_count: 0,// 已激活
				card_count: 0,// 会员卡总数
			}
		},
		onLoad() {
			this.myCreateFamilyPeoplefun();
		},
		onShow() {
			if(uni.getStorageSync('token')){ //登陆了
				
			}else{ //没有登陆
				
				return false;
			}
		},
		//监听滚动
		onPageScroll(e){//处理返回顶部
			if(e.scrollTop>400){
				this.isshowtop = true;
			}else{
				this.isshowtop = false;
			}
		},
		//瀑布流
		onReachBottom() {
			if(this.isshowall==  false){
				this.myCreateFamilyPeoplefun();
			}
		},
		methods:{
			//复制激活码
			copecode(item){
				uni.setClipboardData({
					data:item.activation_code,
					success:()=> {
						this.$api.msg("激活码已复制");
					},
					fail:()=> {
						this.$api.msg("复制失败");
					}
				})
			},
			//搜索事件
			searchfun(){
				this.page = 0;
				this.isshowall = false;
				this.cardlist = [];
				this.myCreateFamilyPeoplefun();
			},
			//卡管理
			myCreateFamilyPeoplefun(){
				this.page++;
				myCreateFamilyPeople({
					page:this.page,
					skeyword:this.skeyword,
				}).then((res)=>{
					if(res.code==1){
						this.cardlist = [...this.cardlist,...res.data];
						
					// 	this.activation_count= res.data.activation_count;// 已激活
					// 	this.card_count= res.data.card_count;// 会员卡总数
						if(res.data.length==0){
							this.isshowall = true;
						}else{
							this.isshowall = false;
						}
					}else{
						
					}
				})
			},
		}
	}
</script>

<style lang="scss">
	@import "./activationcode.scss";
</style>
